﻿<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
<#--<link href="https://cdn.bootcss.com/bootstrap/3.0.1/css/bootstrap.min.css" rel="stylesheet">-->
    <link rel="stylesheet" href="../static/css/pagination.css">
    <link rel="stylesheet" href="../static/css/bootstrap.min.css">
    <link rel="stylesheet" href="../static/css/reset.css">
    <link rel="stylesheet" href="../static/css/client.css">
    <link rel="stylesheet" href="../static/css/user.css">
    <title>容智车联车厢管家</title>
    <style>
        table {
            table-layout: fixed;
            word-break: break-all;
        }
    </style>
</head>
<body>
<div class="container-fluid">
    <!--右边内容区-->
    <div class="row-fluid bg-white  pad-10 bdbox pos-re height100 yaxh">
        <div class="p-b-10 ov-h">
            <form class="navbar-search pull-left"  method="post" action="../user/chooseUser" >
                <input type="text" class="search-query" placeholder="输入搜索信息" name="word" value="${word}"/>
                <button class="search-lence" type="Submit"></button>
            </form>
            <div class="pull-right offset4">
                <button class="btn bg-color" name="addUser" id="add_info">增加</button>
                <a class="btn bg-color" data-toggle="modal"  href="../user/userExout?word=${word}" download="user.xls">导出</a>
            </div>
        </div>
        <!--以上是搜索框，增加按钮组-->
        <!--以下是内容表格区-->
        <table class="table cl-b table-btn">
            <thead class="four-border">
            <tr>
                <th width="6%">序号</th>
                <th width="10%">用户账号</th>
            <#--<th width="10%">用户密码</th>-->
                <th width="10%">所属客户</th>
                <th width="10%">用户角色</th>
                <th width="10%">用户姓名</th>
                <th width="10%">用户电话</th>
                <th width="12%">用户邮箱</th>
                <th width="8%">备注</th>
                <th width="14%">操作</th>
            </tr>
            </thead>
            <tbody class="m-t-10 t-c" id="f-table">
            <#list userList as user>
            <tr class="${user.id}">
                <td class="t-c port-num">
                    <span class="txt-limit" title="${user.id!""}">${user_index+1+((currentPage-1)*size)}</span>
                </td>
                <td class="port-card">
                    <span class="txt-limit" title="${user.name!""}">${user.name!""}</span>
                </td>
                <td class="port-owner">
                    <span class="txt-limit" title="${user.clientName!""}">${user.clientName!""}</span>
                </td>
                <#if (user.type==1)>
                    <td class="port-role">
                        <span class="txt-limit" title="超级管理员">超级管理员</span></td>
                </#if>
                <#if (user.type==2)>
                    <td class="port-role">
                        <span class="txt-limit" title="客户管理员">客户管理员</span>
                    </td>
                </#if>
                <#if (user.type==3)>
                    <td class="port-role">用户</td>
                </#if>

                <td class="port-name">
                    <span class="txt-limit" title="${user.userName!""}">${user.userName!""}</span>
                </td>
                <td class="port-tel">
                    <span class="txt-limit" title="${user.tel!""}">${user.tel!""}</span>
                </td>
                <td class="port-email">
							<span class="txt-limit" title="${user.email!""}">
								${user.email!""}</sapn>
							</span>
                </td>
                <td class="port-node">
                    <span class="txt-limit" title="${user.remake!""}">${user.remake!""}</span>
                </td>
                <td>
                    <button class="btn bg-color rewrite update_info" name="addUser">修改</button>
                    <button class="btn bg-color2" data-toggle="modal" data-target="#myModal">删除</button>
                </td>
            </tr>
            </#list>
            </tbody>
        </table>
        <div class="M-box"></div>
        <!-- 分页 -->
    <#--<div class="col-md-12 column">-->
    <#--<ul class="pagination pull-right">-->
    <#--<ul class="pagination">-->
    <#--<li class="disabled">-->
    <#--<a href="#">上一页</a>-->
    <#--</li>-->
    <#--<li class="disabled">-->
    <#--<a href="#">1</a>-->
    <#--</li>-->
    <#--<li class="disabled">-->
    <#--<a href="#">下一页</a>-->
    <#--</li>-->
    <#--</ul>-->
    <#--</ul>-->
    <#--</div>-->
    <#--动态分页-->
        <div class="col-md-12 column">
            <ul class="pagination pull-right">
                <ul class="pagination">
                <#if currentPage lte 1>
                    <li class="disabled"><a href="#">上一页</a></li>
                <#elseif type == "1">
                    <li><a href="../user/getUser?page=${currentPage - 1}&size=${size}">上一页</a></li>
                <#elseif type == "2">
                    <li><a href="../user/chooseUser?page=${currentPage - 1}&size=${size}&word=${word}">上一页</a></li>
                </#if>
                <#if  maxSize gte 10>
                    <#if currentPage gte 6 && currentPage lte maxSize-4>
                        <#list currentPage-5.. currentPage+4 as index>
                            <#if currentPage == index>
                                <li class="disabled"><a href="#">${index}</a></li>
                            <#elseif type == "1">
                                <li><a href="../user/getUser?page=${index}&size=${size}">${index}</a></li>
                            <#elseif type == "2">
                                <li><a href="../user/chooseUser?page=${index}&size=${size}&word=${word}">${index}</a>
                                </li>
                            </#if>
                        </#list>
                        <li class="disabled"><a>...</a></li>
                    <#elseif currentPage lte 6>
                        <#list 1..10 as index>
                            <#if currentPage == index>
                                <li class="disabled"><a href="#">${index}</a></li>
                            <#elseif type == "1">
                                <li><a href="../user/getUser?page=${index}&size=${size}">${index}</a></li>
                            <#elseif type == "2">
                                <li><a href="../user/chooseUser?page=${index}&size=${size}&word=${word}">${index}</a>
                                </li>
                            </#if>
                        </#list>
                        <li class="disabled"><a>...</a></li>
                    <#elseif currentPage gte maxSize-4>
                        <#list maxSize-10.. maxSize as index>
                            <#if currentPage == index>
                                <li class="disabled"><a href="#">${index}</a></li>
                            <#elseif type == "1">
                                <li><a href="../user/getUser?page=${index}&size=${size}">${index}</a></li>
                            <#elseif type == "2">
                                <li><a href="../user/chooseUser?page=${index}&size=${size}&word=${word}">${index}</a>
                                </li>
                            </#if>
                        </#list>
                    <#elseif currentPage lte maxSize-4>
                        <#list currentPage-10.. maxSize as index>
                            <#if currentPage == index>
                                <li class="disabled"><a href="#">${index}</a></li>
                            <#elseif type == "1">
                                <li><a href="../user/getUser?page=${index}&size=${size}">${index}</a></li>
                            <#elseif type == "2">
                                <li><a href="../user/chooseUser?page=${index}&size=${size}&word=${word}">${index}</a>
                                </li>
                            </#if>
                        </#list>
                    <#else >
                        <#list currentPage.. 10 as index>
                            <#if currentPage == index>
                                <li class="disabled"><a href="#">${index}</a></li>
                            <#elseif type == "1">
                                <li><a href="../user/getUser?page=${index}&size=${size}">${index}</a></li>
                            <#elseif type == "2">
                                <li><a href="../user/chooseUser?page=${index}&size=${size}&word=${word}">${index}</a>
                                </li>
                            </#if>
                        </#list>
                        <li class="disabled"><a>...</a></li>
                    </#if>
                <#else >
                    <#list 1..maxSize as index>
                        <#if currentPage == index>
                            <li class="disabled"><a href="#">${index}</a></li>
                        <#elseif type == "1">
                            <li><a href="../user/getUser?page=${index}&size=${size}">${index}</a></li>
                        <#elseif type == "2">
                            <li><a href="../user/chooseUser?page=${index}&size=${size}&word=${word}">${index}</a></li>
                        </#if>
                    </#list>
                </#if>
                <#if currentPage gte maxSize>
                    <li class="disabled"><a href="#">下一页</a></li>
                <#elseif type == "1">
                    <li><a href="../user/getUser?page=${currentPage + 1}&size=${size}">下一页</a></li>
                <#elseif type == "2">
                    <li><a href="../user/chooseUser?page=${currentPage + 1}&size=${size}&word=${word}">下一页</a></a>
                    </li>
                </#if>
                </ul>
            </ul>
        </div>
        <!--以下是信息修改/新建信息弹出页面-->
        <div class="pos-ab wh-bfb pad-30 bdbox dis-no" id="pop_info">
            <input type="hidden" id="userId">
            <div class="container w-lim pad-10 ov-h bdbox">
                <div class="row-fluid p-bt-10 bot-dot">
                    <div class="span3 offset1 text-right">用户账号:</div>
                    <div class="span2">
                        <input type="text" placeholder="点击再次输入" class="card-input"/></div>
                </div>
                <div class="row-fluid p-t-10 bot-dot">
                    <div class="span3 offset1 text-right">用户密码:</div>
                    <div class="span2">
                        <input type="password" placeholder="点击再次输入" class="code-input"/>
                    </div>
                </div>
                <div class="row-fluid p-t-10 bot-dot">
                    <div class="span3 offset1 text-right">所属公司:</div>
                    <div class="span8  pos-re">
                        <#--<input type="text" placeholder="点击再次输入" class="owner-input" rea/>-->
                        <select placeholder="点击选择" class="owner-input" id="" value="">
                            <#list clients as clients>
                                <option value="${clients.name!""}">${clients.name!""}</option>
                            </#list>
                        </select>
                    <#--<span class="btn-ljj btn bg-color" id="recheck-btn">修改/查看</span>-->
                    </div>
                </div>
                <div class="row-fluid p-t-10 bot-dot">
                    <div class="span3 offset1 text-right">用户角色:</div>
                    <div class="span2 pos-re">
                    <#--<input type="text" placeholder="普通用户" class="role-input" value="普通用户" readonly/>-->
                        <select placeholder="角色名称" class="type-input" id="" value="">
                            <option value="2">客户管理员</option>
                            <option value="3">普通用户</option>
                        </select>
                    <#--<button class="btn btn-info pos-ab auth-btn dis-no" id="auth-btn">
                        查看权限
                    </button>-->
                        <ul class="power-pop pos-ab dis-no pad-10 four-border">
                            <li class="text-center p-b-10">客户管理</li>
                            <li class="text-center p-b-10">用户管理</li>
                            <li class="text-center p-b-10">场站管理</li>
                            <li class="text-center p-b-10">车辆管理</li>
                            <li class="text-center p-b-10">设备管理</li>
                        </ul>
                    </div>
                </div>
                <div class="row-fluid p-t-10 bot-dot">
                    <div class="span3 offset1 text-right">用户姓名:</div>
                    <div class="span2 ">
                        <input type="text" placeholder="点击再次输入" class="name-input"/>
                    </div>
                </div>
                <div class="row-fluid p-t-10 bot-dot">
                    <div class="span3 offset1 text-right">用户电话:</div>
                    <div class="span2">
                        <input type="text" placeholder="点击再次输入" class="tel-input"/>
                    </div>
                </div>
                <div class="row-fluid p-t-10 bot-dot">
                    <div class="span3 offset1 text-right">用户邮箱:</div>
                    <div class="span2">
                        <input type="text" placeholder="点击再次输入" class="email-input"/>
                    </div>
                </div>
                <div class="row-fluid p-t-10 bot-dot">
                    <div class="span3 offset1 text-right">用户备注:</div>
                    <div class="span2">
                        <input type="text" placeholder="点击再次输入" class="node-input"/>
                    </div>
                </div>
                <input type="hidden" value="3" id="userType" class="type-input"/>
            </div>
            <div class="w-lim2 pad-10 ov-h bdbox">
                <!--以下按钮组用于修改信息用-->
                <div class="row-fluid p-t-30 dis-no" id="txt_add">
                    <button class="btn span5 bg-color pull-left leftBtn" id="updateUser">确定</button>
                    <button class="btn span5 bg-color2 pull-right rightBtn">返回</button>
                </div>
                <!--以下按钮组用于新建信息用-->
                <div class="row-fluid p-t-30 dis-no" id="new_add">
                    <button class="btn span5 bg-color pull-left leftBtn" id="addCommonUser">确定</button>
                    <button class="btn span5 bg-color2 pull-right rightBtn">返回</button>
                </div>
            </div>
        </div>
    </div>
</div>
</div>

<!-- 点击删除按钮时弹出的模态框（Modal） -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"
     style="width:350px;margin-left:-175px">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header bg-color">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                    &times;
                </button>
                <p class="modal-title text-center " id="myModalLabel">
                    提示消息
                </p>
            </div>
            <div class="modal-body text-center">
                是否确认删除?
            </div>
            <div class="modal-footer text-center">
                <button type="button" class="btn bg-color span2" data-dismiss="modal">取消
                </button>
                <button type="button" class="btn bg-color2 span2" id="deleteUser">
                    删除
                </button>
            </div>
        </div>
    </div>
</div>
<!-------查看/修改的模态窗--------->
<div id="pop-bottom">
</div>

<!--以下是新建信息弹出页面-->
<div class="container ov-h bdbox bg-white p-b-20 pos-re new-count dis-no" id="new-count">
    <h3 class="text-center tit-top p-r-10 pos-re">添加所属场站</br>
        <button type="button" class="close fix-close p-t-10 p-l-10" data-dismiss="modal" aria-hidden="true">
            &times;
        </button>
        <div class="pos-re">
            <form class="navbar-search  m-l-62">
                <input type="text" class="search-query" placeholder="输入关键字"/>
                <span class="search-lence2"></span>
            </form>
        </div>
    </h3>
    <div class="row-fluid pad-10 bdbox">
        <ol class="span6 p-l-10 p-r-10 bdbox text-center" id="left-list">
            <dt class="p-b-10">已选（0项）</dt>
            <dd class="p-b-10"><input type="checkbox" checked/> 北京亦庄场站</dd>
            <!--<dd class="p-b-10"><input type="checkbox"/> 天津五河场站</dd>
          <dd class="p-b-10"><input type="checkbox"/> 天津五河场站</dd>
          <dd class="p-b-10"><input type="checkbox"/> 天津五河场站</dd>
          <dd class="p-b-10"><input type="checkbox"/> 天津五河场站</dd> -->
        </ol>
        <ol class="span6  p-l-10 p-r-10 bdbox text-center" id="right-list">
            <dt class="p-b-10">待选（5项）</dt>
            <dd class="p-b-10"><input type="checkbox"/> 北京西二旗场站</dd>
            <dd class="p-b-10"><input type="checkbox"/> 北京西三旗场站</dd>
            <dd class="p-b-10"><input type="checkbox"/> 北京海淀旗场站</dd>
            <dd class="p-b-10"><input type="checkbox"/> 北京丰台旗场站</dd>
            <dd class="p-b-10"><input type="checkbox"/> 北京顺义旗场站</dd>
        </ol>
    </div>
    <div class="row-fluid p-t-10 p-l-48 p-l-20" id="new_add">
        <button class="btn span8 bg-color offset1">确认添加</button>
    </div>
</div>
<script src="../static/js/jquery.min.js"></script>
<script src="../static/js/bootstrap.min.js"></script>
<script src="../static/js/user.js"></script>
<script src="../static/js/user/userClient.js"></script>
<script src="../static/js/jquery.pagination.js"></script>
<#--<script>-->
<#--$('.M-box').pagination({-->
<#--pageCount:50,-->
<#--jump:true,-->
<#--coping:true,-->
<#--homePage:'首页',-->
<#--endPage:'末页',-->
<#--callback:function(api){-->
<#--$('.now').text(api.getCurrent());-->
<#--}-->
<#--},function(api){-->
<#--$('.now').text(api.getCurrent());-->
<#--});-->

<#--</script>-->
<script>
    $(function () {

        $('#recheck-btn').click(function () {
            $('#pop-bottom').css('display', 'block');//弹出新建信息页面
            $('#new-count').find('input').val('');//初始化新建信息页面
            $('#new-count').css('display', 'block');//显示新建信息页面的按钮组
        });
    })
</script>

</body>
</html>
